<!DOCTYPE html>
<html>

<head lang="en">
    <meta charset="UTF-8">
    <title>html 表格导出道</title>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="./exec.js"></script>
    <script language="JavaScript" type="text/javascript">
        $(document).ready(function() {
            $("#btnExport").click(function() {
                $("#tableExcel").table2excel({
                    exclude: ".excludeThisClass",
                    name: "Worksheet Name",
                    filename: "SomeFile" //do not include extension

                });
            });
        });
    </script>
    <script src="./sheetjs.js">
    </script>
    <script>
        function exportExcel() {
            /* generate workbook object from table */
            let wb = XLSX.utils.table_to_book(document.querySelector('#tableExcel'));
            /* get binary string as output */
            let wbout = XLSX.write(wb, {
                bookType: 'xlsx',
                bookSST: true,
                type: 'array'
            });
            // try {
            //     FileSaver.saveAs(new Blob([wbout], {
            //         type: 'application/octet-stream'
            //     }), '文件的名字.xlsx');
            // } catch (e) {
            //     if (typeof console !== 'undefined')
            //         console.log(e, wbout)
            // }
            return wbout
        }

        function downloadExcel() {
            const colmns = [
                [{
                    v: '1-1'
                }, {
                    v: '1-2'
                }],
                [{
                    v: '2-1'
                }, {
                    v: '2-2'
                }]
            ]
            const ws = {}
            colmns.forEach((row, rowIndex) => {
                row.forEach((col, colIndex) => {
                    var cell_ref = XLSX.utils.encode_cell({
                        c: colIndex,
                        r: rowIndex
                    })
                    ws[cell_ref] = col
                })
            })
            const range = {
                s: {
                    c: 0,
                    r: 0
                },
                e: {
                    c: 1,
                    r: 1
                }
            }
            ws['!ref'] = XLSX.utils.encode_range(range)

            function s2ab(s) {
                var buf = new ArrayBuffer(s.length)
                var view = new Uint8Array(buf)
                for (var i = 0; i != s.length; ++i) {
                    view[i] = s.charCodeAt(i) && 0xff
                }
                return buf
            }
            // const wb = {
            //     SheetNames: ['xxxx'],
            //     Sheets: {
            //         xxxx: ws
            //     },
            // }
            const wb = XLSX.utils.book_new()
            wb.SheetNames.push('xxxx')
            wb.Sheets['xxxx'] = ws
            const wbout = XLSX.write(wb, {
                bookType: 'xlsx',
                bookSST: true,
                type: "binary"
            })
            console.log(wb, wbout);
            // return

            // const wbout = exportExcel()
            const link = document.createElement('a')
            exportExcel()
            link.href = window.URL.createObjectURL(new Blob([s2ab(wbout)], {
                type: "application/octet-stream"
            }))
            link.setAttribute("download", 'xxxx.xlsx')
            link.click()
        }
    </script>

</head>

<body>

    <div>

        <button type="button" id="btnExport" οnclick="method5('tableExcel')">导出Excel</button>
        <button type="button" id="sheetjsExport">sheetjs导出Excel</button>

    </div>
    <div id="myDiv">
        <table id="tableExcel" width="100%" border="1" cellspacing="0" cellpadding="0">
            <tr>
                <td colspan="5" align="center">html 表格导出道Excel</td>
            </tr>
            <tr>
                <td colspan="2">列标题1</td>
                <td>列标题2</td>
                <td>类标题3</td>
                <td>列标题4</td>
                <!-- <td>列标题5</td> -->
            </tr>
            <tr>
                <td>aaa</td>
                <td>bbb</td>
                <td>ccc</td>
                <td>ddd</td>
                <td>eee</td>
            </tr>
            <tr>
                <td>AAA</td>
                <td>BBB</td>
                <td>CCC</td>
                <td>DDD</td>
                <td>EEE</td>
            </tr>
            <tr>
                <td>FFF</td>
                <td>GGG</td>
                <td>HHH</td>
                <td>III</td>
                <td>JJJ</td>
            </tr>
        </table>
    </div>
    <script>
        document.getElementById('sheetjsExport').onclick = downloadExcel
    </script>
</body>

</html>